<!DOCTYPE html>
<html>
<head>
    <title>My ToDo List</title>
    <meta charset="utf-8">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <!-- build:css styles/main.css -->
    <link rel="stylesheet" href="../bower_components/bootstrap/dist/css/bootstrap.css" />
    <link rel="stylesheet" href="./styles/main.css" />
    <!-- endbuild -->

    <!-- build:js scripts/app.js -->
    <script type="text/javascript" src="../bower_components/angular/angular.js"></script>
    <script type="text/javascript" src="./scripts/app.js"></script>
    <!-- endbuild -->
</head>
<body ng-app="App" ng-controller="ListCtrl">
<div class="container">
    <div class="row">
        <div class="col-md-2"></div>
        <div class="col-md-8">
            <ul class="list-group">
                <li ng-repeat="item in todoItems" class="list-group-item">
                    <div class="item">
                        <input type="checkbox" ng-model="item.done" />
                        <label class="item-content" ng-class="{'item-done': item.done}">{{item.content}}</label>
                        <a href ng-click="removeItem(item);" class="item-remove glyphicon glyphicon-remove" aria-hidden="true"></a>
                    </div>
                </li>
            </ul>
            <form name="addForm" class="form-inline" ng-submit="addForm.$valid && addItem();" novalidate>
                <input type="text" class="form-control" ng-model="content" required/>
                <button type="submit" class="btn btn-success"><i class='glyphicon glyphicon-plus'></i></button>
            </form>
        </div>
        <div class="col-md-2"></div>
    </div>
</div>
</body>
</html>